jQuery fadeOut ()
The jQuery fadeOut() method is used to fade out (hide) the selected
elements.
Syntax
$(selector).fadeOut(speed, easing, callback);
- speed (optional): Specifies the duration of the fade-out effect. Can be slow, fast, or a number of milliseconds (e.g., 400).
- easing (optional): Specifies the easing function for the transition. Default is swing, and another option is linear.
- callback (optional): A function to be executed once the fade-out is complete.
<!DOCTYPE html>
<html>
<head>
<title>jQuery fadeOut() Example</title>
</head>
<body>
<button id="hideButton">Fade Out</button>
<div id="content" style="background-color: lightblue; width: 200px;
height: 100px;">
This content will fade out!
</div>
<script>
$(document).ready(function() {
$("#hideButton").click(function() {
$("#content").fadeOut(1000, 'swing', function() {
alert("Fade-out
complete!");
});
});
});
</script>
</body>
</html>
